<!doctype HTML public "-//W3C//DTD HTML 4.0 Frameset//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="Adobe RoboHelp - www.adobe.com">
<title>Formatting an Interactive Bubble Graph widget</title>
<link rel="stylesheet" href="userhelp_ns.css"><script type="text/javascript" language="JavaScript" title="WebHelpSplitCss">
<!--
if (navigator.appName !="Netscape")
{   document.write("<link rel='stylesheet' href='userhelp.css'>");}
//-->
</script>
<style type="text/css">
<!--
table.whs1 { x-cell-content-align:top; width:100%; border-spacing:0px; }
col.whs2 { width:32.684%; }
col.whs3 { width:67.316%; }
tr.whs4 { x-cell-content-align:top; height:25px; }
td.whs5 { width:32.684%; border-left-width:1px; border-left-color:#000000; border-left-style:Solid; border-top-style:Solid; border-top-color:#000000; border-top-width:1px; border-right-width:1px; border-right-color:#000000; border-right-style:Solid; border-bottom-style:Solid; border-bottom-color:#000000; border-bottom-width:1px; padding-right:10px; padding-left:10px; }
p.whs6 { font-weight:bold; }
td.whs7 { width:67.316%; border-top-style:Solid; border-top-color:#000000; border-top-width:1px; border-right-width:1px; border-right-color:#000000; border-right-style:Solid; border-bottom-style:Solid; border-bottom-color:#000000; border-bottom-width:1px; padding-right:10px; padding-left:10px; }
tr.whs8 { x-cell-content-align:top; height:159px; }
td.whs9 { width:32.684%; border-left-width:1px; border-left-color:#000000; border-left-style:Solid; border-right-width:1px; border-right-color:#000000; border-right-style:Solid; border-bottom-style:Solid; border-bottom-color:#000000; border-bottom-width:1px; padding-right:10px; padding-left:10px; }
td.whs10 { width:67.316%; border-right-width:1px; border-right-color:#000000; border-right-style:Solid; border-bottom-style:Solid; border-bottom-color:#000000; border-bottom-width:1px; padding-right:10px; padding-left:10px; }
ol.whs11 { list-style:decimal; }
p.whs12 { font-size:9pt; margin-top:4.5pt; }
tr.whs13 { x-cell-content-align:top; height:270px; }
tr.whs14 { x-cell-content-align:top; height:108px; }
tr.whs15 { x-cell-content-align:top; height:231px; }
ul.whs16 { list-style:disc; }
tr.whs17 { x-cell-content-align:top; height:113px; }
tr.whs18 { x-cell-content-align:top; height:225px; }
tr.whs19 { x-cell-content-align:top; height:123px; }
tr.whs20 { x-cell-content-align:top; height:190px; }
tr.whs21 { x-cell-content-align:top; height:246px; }
tr.whs22 { x-cell-content-align:top; height:297px; }
tr.whs23 { x-cell-content-align:top; height:142px; }
-->
</style><script type="text/javascript" language="JavaScript" title="WebHelpInlineScript">
<!--
function reDo() {
  if (innerWidth != origWidth || innerHeight != origHeight)
     location.reload();
}
if ((parseInt(navigator.appVersion) == 4) && (navigator.appName == "Netscape")) {
	origWidth = innerWidth;
	origHeight = innerHeight;
	onresize = reDo;
}
onerror = null; 
//-->
</script>
<style type="text/css">
<!--
div.WebHelpPopupMenu { position:absolute; left:0px; top:0px; z-index:4; visibility:hidden; }
-->
</style><script type="text/javascript" language="javascript1.2" src="whmsg.js"></script>
<script type="text/javascript" language="javascript" src="whver.js"></script>
<script type="text/javascript" language="javascript1.2" src="whproxy.js"></script>
<script type="text/javascript" language="javascript1.2" src="whutils.js"></script>
<script type="text/javascript" language="javascript1.2" src="whlang.js"></script>
<script type="text/javascript" language="javascript1.2" src="whtopic.js"></script>
</head>
<body><script type="text/javascript" language="javascript1.2">
<!--
if (window.gbWhTopic)
{
	if (window.addTocInfo)
	{
	addTocInfo("Creating and modifying documents and dashboards\nProviding Flash-based analysis and interactivity: Widgets\nFormatting widgets\nFormatting an Interactive Bubble Graph widget");
addButton("show",BTN_TEXT,"Show","","","","",0,0,"","","");

	}
	if (window.writeBtnStyle)
		writeBtnStyle();

	if (window.writeIntopicBar)
		writeIntopicBar(1);

	if(1)
	{
	
	}

	if (window.setRelStartPage)
	{
	setRelStartPage("MicroStrategy_Web_Help.htm");

		autoSync(1);
		sendSyncInfo();
		sendAveInfoOut();
	}
}
else
	if (window.gbIE4)
		document.location.reload();

//-->
</script>
<h1>Formatting an Interactive Bubble Graph widget</h1>
<p>For an image of an Interactive Bubble Graph widget and steps to add 
 one to a document, see 
<a HREF="Bubble_widget.htm">Defining an Interactive 
 Bubble Graph widget</a>.</p>
<p>This widget automatically inherits some of the formatting contained 
 in its Grid/Graph. For example, the font colors and types applied to the 
 Grid/Graph are displayed in the widget by default. You can change these 
 default formats. If you do not want to apply any default formatting, clear 
 the <span style="font-weight: bold;"><B>Inherit graph formatting</B></span> check 
 box in the Properties dialog box. </p>
<p>The table below suggests formatting ideas and provides steps to format 
 the Interactive Bubble Graph widget. The steps can be performed in Flash 
 Mode. They can also be performed in Interactive Mode if the widget has 
 been defined to display as a widget in DHTML, and DHTML is enabled in 
 Web. For instructions to determine how the widget is displayed, see 
<a 
 href="Widget_non_Flash.htm">Determining how a widget is rendered in non-Flash 
 modes</a>. For instructions to enable DHTML, see 
<a href="DHTML-only_features_in_Web.htm">Enabling 
 DHTML in MicroStrategy Web</a>.</p>
<table x-use-null-cells cellspacing="0" width="100%" class="whs1">
<script language='JavaScript'><!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) == 4)) document.write("</table><table x-use-null-cells cellspacing='0' width='100%' border='1' bordercolor='black' bordercolorlight='black' bordercolordark='black'>");
//--></script>
<col class="whs2">
<col class="whs3">


<tr valign="top" class="whs4">
<td width="32.684%" class="whs5">
<p class="whs6">What to Format in the Widget </td>
<td width="67.316%" class="whs7">
<p class="whs6">How to Format It </td></tr>

<tr valign="top" class="whs8">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p>Assign colors to the bubbles based on the selected object</td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li class=p><p>In <span style="font-weight: bold;"><B>Flash Mode </B></span>or<span 
 style="font-weight: bold;"><B> Interactive Mode</B></span>, right-click the widget 
 and select<span style="font-weight: bold;"><B> Properties</B></span>. The Properties 
 dialog box opens.</p></li>
	
<li class=p><p>Click the <span style="font-weight: bold;"><B>General </B></span>tab. 
 </p></li>
	
<li class=p><p><span>S</span>elect the <span style="font-weight: bold;"><B>Assign 
 colors based on </B></span>option. </p></li>
	<ul>
<li style="list-style: disc;" type=disc class=p><p>This option 
 allows you to change the colors of the bubbles. You can select the object 
 name from the drop-down list. For instance, if you add Brand to the widget, 
 then each brand's bubble will display in a different color. </p></li>
	</ul>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 <span style="font-weight: bold;"><B>OK</B></span> to save the changes.</p></li>
</ol></td></tr>

<tr valign="top" class="whs13">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p>Determine drilling behavior</td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li class=p><p>In<span style="font-weight: bold;"><B> Flash Mode</B></span> 
 or <span style="font-weight: bold;"><B>Interactive Mode</B></span>, right-click 
 the widget and select <span style="font-weight: bold;"><B>Properties</B></span>. 
 The Properties dialog box opens.</p></li>
	
<li class=p><p>Click the <span style="font-weight: bold;"><B>Drilling</B></span> 
 tab.</p></li>
	
<li class=p><p>Select or clear the <span style="font-weight: bold;"><B>Enable 
 drilling</B></span> check box.</p></li>
	<ul>
<li style="list-style: disc;" type=disc class=p><p>If the check 
 box is selected, a user can click on a bubble in the chart to drill down 
 on that bubble's data. This presents a drilled-to (child) bubble with 
 related data. To enable drilling you must also place a second attribute 
 to the right of the attribute in the rows. For information about this 
 requirement, see 
<a HREF="Bubble_widget.htm">Defining an Interactive Bubble 
 Graph widget</a>.</p></li>
	</ul>
</ol>
<ol start="3" type="1" class="whs11">
	
<li class=p><p>To determine whether a line appears between a drilled 
 bubble and its corresponding drilled-to (child) bubble, select or clear 
 the <span style="font-weight: bold;"><B>Connect bubbles when drilling</B></span> 
 check box. The line allows you to better visualize which bubbles contain 
 related information. </p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 <span style="font-weight: bold;"><B>OK</B></span> to save the changes.</p></li>
</ol>
<p>&nbsp;</td></tr>

<tr valign="top" class="whs14">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p>Show or hide a graph legend</td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li class=p><p>In <span style="font-weight: bold;"><B>Flash Mode</B></span> 
 or <span style="font-weight: bold;"><B>Interactive Mode</B></span>, right-click 
 the widget and select <span style="font-weight: bold;"><B>Properties</B></span>. 
 The Properties dialog box opens.</p></li>
	
<li class=p><p>Click the <span style="font-weight: bold;"><B>General</B></span><span> 
 tab. </span></p></li>
	
<li class=p><p>Select or clear the <span style="font-weight: bold;"><B>Display 
 legend outside of graph</B></span> check box.</p></li>
	
<li class=p><p>Click <span style="font-weight: bold;"><B>OK</B></span> to 
 save the changes.</p></li>
</ol></td></tr>

<tr valign="top" class="whs15">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p>Size of bubbles in reference to parent bubbles </td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li class=p><p>In <span style="font-weight: bold;"><B>Flash Mode</B></span> 
 or <span style="font-weight: bold;"><B>Interactive Mode</B></span>, right-click 
 the widget and select <span style="font-weight: bold;"><B>Properties</B></span>. 
 The Properties dialog box opens.</p></li>
	
<li class=p><p>Click the <span style="font-weight: bold;"><B>General</B></span><span> 
 tab. </span></p></li>
	
<li class=p><p>Do one of the following: </p></li>
</ol>
<ul type="disc" class="whs16">
	<ul type="disc" class="whs16">
		
<li class=p><p>Select the <span style="font-weight: bold;"><B>Use 
 width (vs. area) to size the bubbles</B></span> check box 
 &nbsp;to calculate the sum of the diameters of the drilled-to 
 (child) bubbles as the diameter of the parent bubble.</p></li>
		
<li class=p><p>Clear the <span style="font-weight: bold;"><B>Use width 
 (vs. area) to size the bubbles</B></span> check box to 
 calculate the area of the child bubbles as the area of the parent bubble.</p></li>
	</ul>
</ul>
<ol start="3" type="1" class="whs11">
	
<li class=p><p>You can also specify a maximum bubble size in the <span 
 style="font-weight: bold;"><B>Maximum bubble radius size</B></span> field. </p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 <span style="font-weight: bold;"><B>OK</B></span> to save the changes.</p></li>
</ol></td></tr>

<tr valign="top" class="whs17">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p>Whether or not to display bubbles with a rounded effect</td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li class=p><p>In <span style="font-weight: bold;"><B>Flash Mode</B></span> 
 or <span style="font-weight: bold;"><B>Interactive Mode</B></span>, right-click 
 the widget and select <span style="font-weight: bold;"><B>Properties</B></span>. 
 The Properties dialog box opens.</p></li>
	
<li class=p><p>Click the <span style="font-weight: bold;"><B>General</B></span><span> 
 tab. </span></p></li>
	
<li class=p><p>Select or clear the <span style="font-weight: bold;"><B>Apply 
 Rounded Effect to Bubbles</B></span><span> </span>check box.</p></li>
	
<li class=p><p>Click <span style="font-weight: bold;"><B>OK</B></span> to 
 save the changes.</p></li>
</ol></td></tr>

<tr valign="top" class="whs18">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p>Enable or disable time series animation</td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li class=p><p>In <span style="font-weight: bold;"><B>Flash Mode</B></span> 
 or <span style="font-weight: bold;"><B>Interactive Mode</B></span>, right-click 
 the widget and select <span style="font-weight: bold;"><B>Properties</B></span>. 
 The Properties dialog box opens.</p></li>
	
<li class=p><p>Click the <span style="font-weight: bold;"><B>Time Analysis</B></span> 
 tab. </p></li>
	
<li class=p><p>Select or clear the <span style="font-weight: bold;"><B>Enable 
 time series analysis</B></span> check box. </p></li>
	<ul type="disc" class="whs16">
		
<li class=p><p>If this check box is selected, the user can control 
 the time series animation. To enable time series animation, place a third 
 attribute on the rows of the Grid/Graph. For information about this requirement, 
 see 
<a href="Bubble_widget.htm">Defining an Interactive Bubble Graph widget</a>.</p></li>
	</ul>
</ol>
<ol start="3" type="1" class="whs11">
	
<li class=p><p>If time series analysis is enabled, you can select or 
 clear the <span style="font-weight: bold;"><B>Auto-Hide time</B></span> controls 
 check box, to determine whether the time series animation control bar 
 is automatically hidden from view.</p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 <span style="font-weight: bold;"><B>OK</B></span> to save the changes.</p></li>
</ol></td></tr>

<tr valign="top" class="whs19">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p>Change selection on mouse over</td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li class=p><p>In <span style="font-weight: bold;"><B>Flash Mode</B></span> 
 or <span style="font-weight: bold;"><B>Interactive Mode</B></span>, right-click 
 the widget and select <span style="font-weight: bold;"><B>Properties</B></span>. 
 The Properties dialog box opens.</p></li>
	
<li class=p><p>Click the <span style="font-weight: bold;"><B>Selectors 
 </B></span>tab. </p></li>
	
<li class=p><p>To change what is displayed in the selectable area when 
 you hover the cursor over the area you want to see, select the <span style="font-weight: bold;"><B>Change 
 selection on mouse over </B></span>option. </p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 <span style="font-weight: bold;"><B>OK</B></span> to save the changes.</p></li>
</ol></td></tr>

<tr valign="top" class="whs20">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p>Font formatting for the time series labels (the attribute header)</td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li style=" font-size: 9pt; " class=p><p class="whs12">In 
 <span style="font-weight: bold;"><B>Flash Mode</B></span> or <span style="font-weight: bold;"><B>Interactive 
 Mode</B></span>, right-click the widget and select <span style="font-weight: bold;"><B>Properties</B></span>. 
 The Properties dialog box opens.</p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 the <span style="font-weight: bold;"><B>Time Analysis</B></span> tab.</p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Select 
 the <span style="font-weight: bold;"><B>Font Family</B></span>, <span style="font-weight: bold;"><B>Font 
 Size</B></span>, and <span style="font-weight: bold;"><B>Color</B></span>.</p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">To 
 bold the labels, select the <span style="font-weight: bold;"><B>Bold</B></span> 
 check box.</p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">To 
 italicize the labels, select the <span style="font-weight: bold;"><B>Italic</B></span> 
 check box. </p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 <span style="font-weight: bold;"><B>OK</B></span> to save the changes.</p></li>
</ol>
<p class="whs12"><span style="font-size: 9pt;"><font size=1 style="font-size:9pt;"><span 
 style="font-weight: bold;"><B>Note</B></span>: These options are available only 
 if the <span style="font-weight: bold;"><B>Enable time series analysis</B></span> 
 check box is selected.</font></span></td></tr>

<tr valign="top" class="whs21">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p>Color, opacity, and size of time series animation control </td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li class=p><p>In <span style="font-weight: bold;"><B>Flash Mode</B></span> 
 or <span style="font-weight: bold;"><B>Interactive Mode</B></span>, right-click 
 the widget and select <span style="font-weight: bold;"><B>Properties</B></span>. 
 The Properties dialog box opens.</p></li>
	
<li class=p><p>Click the <span style="font-weight: bold;"><B>Time Analysis</B></span> 
 tab. </p></li>
	
<li class=p><p>On the <span style="font-weight: bold;"><B>Time Analysis</B></span> 
 tab, select or clear the <span style="font-weight: bold;"><B>Enable time 
 series analysis</B></span> check box.</p></li>
	
<li class=p><p>Specify colors from the <span style="font-weight: bold;"><B>Control 
 background color</B></span>, <span style="font-weight: bold;"><B>Control background 
 opacity</B></span>, <span style="font-weight: bold;"><B>Button background colors</B></span>, 
 and <span style="font-weight: bold;"><B>Control highlight color</B></span> drop-down 
 lists.</p></li>
	
<li class=p><p>From the <span style="font-weight: bold;"><B>Control size</B></span> 
 drop-down list, specify the size of the time series animation control. 
 </p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 <span style="font-weight: bold;"><B>OK</B></span> to save the changes.</p></li>
</ol>
<p class="whs12"><span style="font-weight: bold;"><B>Note</B></span>: 
 These options are available only if the <span style="font-weight: bold;"><B>Enable 
 time series analysis</B></span> check box is selected.</p>
<p>&nbsp;</td></tr>

<tr valign="top" class="whs22">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p>Allow the selection box (the lasso) to automatically update the targeted 
 Grid/Graphs and panel stacks, if the widget is used as a selector.</p>
<p>&nbsp;</p>
<p>For example, when this option is enabled, an analyst can drag a selection 
 box around two brand bubbles in the widget to automatically display those 
 brands in the targeted Grid/Graph. </p>
<p class="whs6">Note: <span style="font-weight: normal;">This 
 option does not enable the widget to be used as a selector. You must enable 
 attributes or attribute elements in the Grid/Graph that contains the widget. 
 For more information about this specific requirement, see</span> 
<a href="Bubble_as_selector.htm"><span 
 style="font-weight: normal;">About using an Interactive Bubble Graph widgets 
 as a selector</a>.</span></td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li style=" font-size: 9pt; " class=p><p class="whs12">In 
 <span style="font-weight: bold;"><B>Flash Mode</B></span> or<span style="font-weight: bold;"><B> 
 Interactive Mode</B></span>,<span style="font-weight: bold;"> <B></B></span>right-click 
 the widget and select <span style="font-weight: bold;"><B>Properties</B></span>. 
 The Properties dialog box opens.</p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 the <span style="font-weight: bold;"><B>Selectors</B></span> tab.</p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Select 
 <span style="font-weight: bold;"><B>Trigger selector with lasso automatically.</B></span></p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 <span style="font-weight: bold;"><B>OK</B></span> to save the changes.</p></li>
</ol>
<p>&nbsp;</td></tr>

<tr valign="top" class="whs23">
<td colspan="1" rowspan="1" width="32.684%" class="whs9">
<p class="whs6"><span style="font-weight: normal;">Whether 
 to display in scatter plot mode only</span></td>
<td colspan="1" rowspan="1" width="67.316%" class="whs10">
<ol type="1" class="whs11">
	
<li style=" font-size: 9pt; " class=p><p class="whs12">In 
 <span style="font-weight: bold;"><B>Flash Mode</B></span> or<span style="font-weight: bold;"><B> 
 Interactive Mode</B></span>,<span style="font-weight: bold;"> <B></B></span>right-click 
 the widget and select <span style="font-weight: bold;"><B>Properties</B></span>. 
 The Properties dialog box opens.</p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 the <span style="font-weight: bold;"><B>Scatter Mode </B></span>tab.</p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Select 
 or clear the <span style="font-weight: bold;"><B>Scatter Plot Mode Only</B></span> 
 check box.</p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Type 
 the <span style="font-weight: bold;"><B>Scatter Plot Bubble Radius</B></span><span>.</span></p></li>
	
<li style=" font-size: 9pt; " class=p><p class="whs12">Click 
 <span style="font-weight: bold;"><B>OK</B></span> to save the changes.</p></li>
</ol></td></tr>
<script language='JavaScript'><!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) == 4)) document.write("</table></table><table>");
//--></script>
</table>
<p>&nbsp;</p>
<script type="text/javascript" language="javascript1.2">
<!--
highlightSearch();
if (window.writeIntopicBar)
	writeIntopicBar(0);
if(0)
{

}
//-->
</script>
</body>
</html>
